<template>
	<view class="main-content">
		<scroll-view scroll-y :style="{height: scrollHeight}" class="list-box form-data">
			<text class="title">信息填写</text>
			<view style="padding-top: 20rpx;">
				<uni-forms ref="masterEnterForm" :modelValue="FormData" :rules="rules" label-width="200rpx">
					<uni-forms-item label="企业名" name="entName" >
						<input v-if='examineStatus != 1' type="text" placeholder="请输入" v-model="FormData.entName" style="text-align: right;" />
						<view v-else class="input-value">{{FormData.entName}}</view>
					</uni-forms-item>
					<uni-forms-item label="联系人/法人" name="contact">
						<input v-if='examineStatus != 1' type="text" placeholder="请输入" v-model="FormData.contact" style="text-align: right;" />
						<view v-else class="input-value">{{FormData.contact}}</view>
					</uni-forms-item>
					<uni-forms-item label="联系电话" name="phoneNumber">
						<input v-if='examineStatus != 1' type="number" placeholder="请输入" v-model="FormData.phoneNumber" style="text-align: right;" />
						<view v-else class="input-value">{{FormData.phoneNumber}}</view>
					</uni-forms-item>
				</uni-forms>
			</view>
			
			<view class="form-item-vertical" v-if='examineStatus != 1'>
				<view class="label">
					营业执照
				</view>
				<view  class="upload-box">
					<you-upload 
						:maxCount="1" 
						@changeFile="changeFile($event, 'businessLicense')" 
						:imagePath="FormData.businessLicense"
					></you-upload>
				</view>
			</view>
			<view class="form-item-vertical" v-if="examineStatus == 1 && FormData.businessLicense">
				<view class="label">
					营业执照
				</view>
				<view  class="upload-box">
					<image :src="FormData.businessLicense" mode="scaleToFill"></image>
				</view>
			</view>
		</scroll-view>
		<you-bottom-btn v-if="examineStatus != 1" :btnConfig="bottomBtnConfig" @formSubmit="formSubmit" @testReport="testReport">
		</you-bottom-btn>
	</view>
</template>

<script>
	import Mine from '@/api/mine.js'
	import Common from '@/api/common.js'
	export default {
		data() {
			return {
				FormData: {
					entName: '',
					phoneNumber: '',
					contact: '',
					businessLicense: '',
				},
				rules: {
					entName: {
						rules: [{
							required: true,
							errorMessage: '请输入企业名',
						}]
					},
				},
				bottomBtnConfig: [{
					text: '提交认证申请',
					class: 'confirm',
					funcName: 'formSubmit'
				}],
				fileImage: {
					idCardFront: [],
					idCardBack: []
				},
				examineStatus: 0
			}
		},
		onLoad() {
			// 获取当前用户角色
			this.getUserInfo();
		},
		methods: {
			async getUserInfo() {
				let res = await Common.getInfo();
				if(res.wbEntAuth && JSON.stringify(res.wbEntAuth) != '{}') {
					Object.keys(this.FormData).forEach(key => {
						this.FormData[key] = res.wbEntAuth[key]
						this.$set(this.FormData, key, res.wbEntAuth[key])
					})
					this.examineStatus = res.wbEntAuth.state;
				}
				if (res.ifDownload && res.ifDownload.length != 0) {
					uni.showToast({
						title: '您还有未下载文件，请前往维保记录下载',
						icon: 'none'
					});
				}
			},
			formSubmit() {
				this.$refs.masterEnterForm.validate().then(res => {
					console.log('表单数据信息：', res);
					Mine.setEntAuth(this.FormData).then(res => {
						if(res.code == 200) {
							uni.showToast({
								icon: 'none',
								title: '申请成功，请耐心等待审核结果'
							})
							setTimeout(() => {
								uni.switchTab({
									url: '/pages/mine'
								})
							}, 1000)
						}
					})
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			changeFile(e, key) {
				this.$set(this.FormData, key, e);
			}
		}
	}
</script>

<style scoped lang="scss">
	.main-content {
		width: 100%;
		height: 100%;
		padding: 20rpx 30rpx;

		.list-box {
			padding: 0 20rpx;
			border-radius: 16rpx;
			background: #ffffff;

			.title {
				padding: 20rpx 0;
				display: block;
				border-bottom: 2rpx solid #acacac;
				font-family: "PingFang SC";
				font-size: 28rpx;
				font-style: normal;
				font-weight: 600;
				line-height: 40rpx;
				opacity: 0.9;
			}
			.input-value {
				text-align: right;
				font-size: 28rpx;
				color: $main-font-black;
			}
		}
	}
	.form-item-vertical {
		.label {
			color: #1a1a1a;
			font-size: 28rpx;
			padding: 20rpx 0;
			// &::before {
			// 	content: "*";
			// 	color: red;
			// 	font-size: 30rpx;
			// 	display: inline-block;
			// 	margin-right: 10rpx;
			// 	width: 5rpx;
			// 	height: 20rpx;
			// }
		} 
	}
	.upload-box {
		height: 200rpx;
		width: 200rpx;
		image {
			width: 100%;
			height: 100%;
		}
	}
	.upload-after {
		background: #F6F8FA;
		width:198rpx;
		height:198rpx;
		line-height: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.form-data {
		/deep/.uni-forms-item__label {
			color: #666;
		}
	}
</style>